<?php

if(!empty($_POST))
{
    //Post
    $p =& $_POST;

    //Response
    $response = array(
        'msg'    => 'received',
        'status' => 1,
        'errors' => 0,
        'validation' => array()
    );

    //Validation
    $validation =& $response['validation'];

    try
    {
        if(empty($p['firstName']))
        {
            $validation['firstName'] = array(
                'isEmpty' => 'First name cannot be empty'
            );
        }

        if(empty($p['email']))
        {
            $validation['email'] = array(
                'isEmpty' => 'Email cannot be empty',
                'isEmail' => 'Not a valid email address'
            );
        }

        if(!empty($validation))
        {
            throw new Exception('Please correct the highlighted fields');
        }
    }
    catch(Exception $e)
    {
        $response['errors'] = 1;
    }

    //Encode the response to json format
    echo json_encode($response);
    die();
}
?>
<!DOCTYPE html>
<html>
<head>
    <title>Library Test</title>
    <link rel="stylesheet" href="../../css/bootstrap.css">
    <script type="text/javascript" src="../jquery-1.7.1.js"></script>
    <script type="text/javascript" src="../pimform.jquery.js"></script>
    <script type="text/javascript">
        jQuery(document).ready(function($)
        {
            $('#testForm').pimForm();
        });
    </script>
</head>
<body>
<br />
  <form id="testForm" name="testForm" action="<?php echo $_SERVER['PHP_SELF']?>" class="form-stacked" method="post">
    <fieldset>
      <legend>Ajax Form</legend>
        <div class="alert-message warning">
            <p>Please fill the form</p>
        </div>

        <div class="clearfix">
        <label for="firstName">First Name</label>
        <div class="input">
          <input class="xlarge" id="firstName" name="firstName" size="30" type="text">
        </div>
      </div><!-- /clearfix -->

      <div class="clearfix">
        <label for="stackedSelect">Select</label>
        <div class="input">
          <select name="stackedSelect" id="stackedSelect">
            <option>1</option>
            <option>2</option>
            <option>3</option>
            <option>4</option>
            <option>5</option>
          </select>
        </div>
      </div><!-- /clearfix -->
    </fieldset>

    <fieldset>
      <legend>Contact Details</legend>

      <div class="clearfix">
        <label for="email">Email</label>
        <div class="input">
          <input class="xlarge" id="email" name="email" size="30" type="text">
        </div>
      </div><!-- /clearfix -->

      <div class="clearfix error">
        <label for="message">Message</label>
        <div class="input">
          <input class="xlarge error" id="message" name="message" size="30" type="text">
          <span class="help-inline">Enter a message</span>
        </div>
      </div><!-- /clearfix -->

    </fieldset>

    <div class="actions">
      <button type="submit" class="btn primary">Save changes</button>&nbsp;<button type="reset" class="btn">Cancel</button>
    </div>

    <input id="r" name="r" type="hidden" value="error" />
  </form>
</body>
</html>